option = {
    timeline: {
        data: [
            '2012', '2013', '2014', '2015', '2016', '2017', '2018'
        ],
        left: '5%',
        right: '10%',
        bottom: 0,
        height: -120,
        axisType: 'category',
        show: true,
        autoPlay: false,
        playInterval: 1000,
        checkpointStyle: {
            color: '#04a5f1',
            borderColor: 'rgba(4, 165, 261, .5)'
        },
        label: {
            normal: {
                formatter: function(v) {
                    var _txt = v.replace(/\//igm, '\n');
                    return _txt;
                },
                rotate: -45,
                position: 'bottom',
                fontSize: '10'
            }
        },
        itemStyle: {
            normal: {
                color: '#04a5f1'
            },

        },
        lineStyle: {
            color: '#ddd'
        },
        controlStyle: {
            show: false,
        },
    },
    options: [{
        textStyle: {
            fontSize: 18,
            height:80,
        },
        tooltip: {
            trigger: 'axis',
            axisPointer: {
                type: 'cross',
                label: {
                    backgroundColor: 'rgba(255,255,255,0.8)',
                    extraCssText: 'box-shadow: 0 0 8px rgba(0, 0, 0, 0.3);',
                    textStyle: {
                        color: '#666',
                    },
                },
            },
            backgroundColor: 'rgba(255,255,255,0.8)',
            extraCssText: 'box-shadow: 0 0 8px rgba(0, 0, 0, 0.3);',
            textStyle: {
                color: '#666',
            },
        },
        toolbox: {
            'show': false,
            // orient: 'vertical',
            //x: 'right',
            //y: 'center',
            feature: {
                'magicType': {
                    'show': true,
                    'type': ['bar', 'line']
                },
                restore: {
                    'show': true
                },
                saveAsImage: {
                    'show': true
                }
            }
        },
        legend: {
            data: ['项目业绩(万元)', '项目数量(个)'],
        },
        grid: {
            top: '100',
            left: '7%',
            right: '8%',
            bottom: '50',
            containLabel: true
        },
        xAxis: [{
            type: 'category',
            data: ['2012', '2013', '2014', '2015', '2016', '2017', '2018'],
            axisLabel: { //坐标轴刻度标签的相关设置。
                interval: 0, //设置为 1，表示『隔一个标签显示一个标签』
                //rotate:-30,
                textStyle: {
                    color: '#666',
                    fontSize: '18',
                }
            },
            axisLine: { //坐标轴轴线相关设置
                lineStyle: {
                    color: '#666',
                    opacity: 1
                }
            },
            splitLine: { //坐标轴在 grid 区域中的分隔线。
                show: false,
            }
        }],
        yAxis: [{
            name: '项目业绩(万元)',
            type: 'value',

            axisLabel: {
                textStyle: {
                    color: '#666',
                    fontSize: '18'
                }
            },
            axisLine: {
                show: false
            },
            axisTick: {
                show: false
            },
            splitLine: {
                show: false,
            }

        }, {
            name: '项目数量(个)',
            type: 'value',
            position: 'right',
            axisLabel: {
                textStyle: {
                    color: '#666',
                    fontSize: '18',
                }
            },
            axisLine: {
                show: false
            },
            axisTick: {
                show: false
            },
            splitLine: {
                show: false,
            }
        }],
        series: [{
            'name': '项目业绩(万元)',
            'type': 'bar',
            // barWidth: 15,
            'data': [12318, 15360, 11760, 11447, 7325, 15696, 10590],
            itemStyle: {
                normal: {
                    //barBorderRadius: 15,
                    color: new echarts.graphic.LinearGradient(
                        0, 0, 0, 1, [{
                            offset: 0,
                            color: '#229aff'
                        },
                            {
                                offset: 1,
                                color: '#13bfe8'
                            }
                        ]
                    )
                }
            }
        }, {
            name: '项目数量(个)',
            yAxisIndex: 1,
            type: 'line',
            showAllSymbol: true,
            symbol: 'emptyCircle',
            symbolSize: 14,
            data: [1061, 992, 1244, 4020, 818, 1032, 2092],
            itemStyle: {
                normal: {
                    color: '#fdb94e'
                },
            },
        }]
    }]
};

var myChart = echarts.init(document.getElementById('z_tu'));
myChart.setOption(option);

